import { Button, Table, message } from 'antd';
import axios from 'axios';
import React, { Component } from 'react';

class Order extends Component {
    state = {
        all: []
    };

    componentDidMount() {
        this.getAllOrders();
        this.timer = setInterval(this.updateExpirationTime, 1000);
    }

    componentWillUnmount() {
        clearInterval(this.timer);
    }

    getAllOrders = () => {
        const user = JSON.parse(localStorage.getItem('user'));
        axios.get('/shopping-order-server/order/all?userId=' + user.id)
            .then(response => {
                const resp = response.data;
                if (resp.success) {
                    this.setState({ all: resp.data });
                } else {
                    message.info(JSON.stringify(resp.data));
                }
            }).catch(error => {
                message.error(error);
            });
    }

    updateExpirationTime = () => {
        this.setState(prevState => ({
            all: prevState.all.map(item => ({
                ...item,
                expirationTime: item.expirationTime > 0 ? item.expirationTime - 1 : 0
            }))
        }));
    }

    pay = (id,orderNumber) => {
        axios.get('/shopping-order-server/pay?id=' + id+'&orderNumber='+orderNumber)
            .then(response => {
                const resp = response.data;
                if (resp.success) {
                    message.success(JSON.stringify(resp.data));
                    this.getAllOrders()
                } else {
                    message.info(JSON.stringify(resp.data));
                }
            }).catch(error => {
                message.error(error);
            });
    }

    render() {
        const t = localStorage.getItem("token");
        if (!t) {
            message.info('未登录，1秒后跳转登录');
            setTimeout(() => {
                location.href = '/login';
            }, 1000);
            return null;
        }

        const columns = [
            {
                title: '序号',
                render: (text, record, index) => index + 1,
            },
            {
                title: '订单号',
                dataIndex: 'orderNumber',
            },
            {
                title: '创建时间',
                dataIndex: 'createTime',
            },
            {
                title: '付款时间',
                dataIndex: 'payTime',
            },
            {
                title: '品牌',
                dataIndex: 'brand',
            },
            {
                title: '数量',
                dataIndex: 'productQuantity',
            },
            {
                title: '金额',
                dataIndex: 'amount',
            },
            {
                title: '状态',
                render: (_, record) => {
                    if (record.status === '-1') {
                        return <span>订单已过期</span>;
                    } else if (record.status === '1') {
                        return <span>订单已完成</span>;
                    } else {
                        // 其他状态的处理逻辑
                        return <span>待支付</span>;
                    }
                }
            },
            {
                title: '过期时间',
                render: (_, record) => {
                    if (record.status === '-1') {
                        return <span>已过期</span>;
                    } else if (record.status === '0') {
                        return (<span>{record.expirationTime}秒( &&<Button type='primary' onClick={()=>this.pay(record.id,record.orderNumber)}>去支付</Button>)</span>)
                    } else {
                        // 其他状态的处理逻辑
                        return <span>已完成</span>;
                    }
                }
            },
        ];

        const { all } = this.state;

        return (
            <div>
                <Table
                    columns={columns}
                    dataSource={all}
                    pagination={false}
                />
                <Button onClick={this.buy}>结算</Button>
            </div>
        );
    }
}

export default Order;
